<style lang="less" scoped>
    @import "../../style/A.css";
</style>
<template>
    <div class="A_content">
        <div class="A_set1">
            <Row style="margin-right:4%;margin-left:1%;">
                <Col span="4" style="margin-top:50px;">
                    <p style="color:#049BFF;font-size:20px;">搜 索</p>
                    <p style="margin-top:16px;">用户类别</p>
                    <Select v-model="grade" size="small" style="width: 100%;margin-top:6px;" @on-change="searchByGrade">
                        <Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
                    </Select>
                    <p style="margin-top:6px;">名称检索</p>
                    <Input v-model="search_name" size="small" placeholder="Please enter" clearable
                           style="width: 100%;margin-top:6px;"/>
                    <p style="margin-top:6px;">学号搜索</p>
                    <Input v-model="search_id" size="small" placeholder="Please enter" clearable
                           style="width: 100%;margin-top:6px;"/>
                    <Button class="run_button" v-on:click="search">执行</Button>
                    <Button class="delete_button" v-on:click="callback">撤销</Button>
                </Col>

                <Col span="1">
                    <div class="hr_shu"></div>
                </Col>

                <Col span="19">
                    <Table border :columns="columns7" :data="data6" style="margin-top:50px;"></Table>
                    <Page
                            :total="total"
                            :current="pageNum"
                            :page-size="pageSize"
                            show-elevator
                            style="margin-top: 10px"
                            @on-change="handlePage"/>
                </Col>
            </Row>


        </div>
    </div>
</template>


<script scoped>
    export default {
        created() {
            this.$store.commit('setATitle', 'member');
            this.searchByGrade(this.grade);

        },
        data() {
            return {
                value14: '',
                value15: '',
                columns7: [{
                    title: '序号',
                    key: 'id',
                    width: 70,
                }, {
                    title: '用户名称',
                    key: 'realname',
                    minWidth:100
                }, {
                    title: '学号',
                    key: 'schoolid',
                    width: 180
                }, {
                    title: '分类',
                    key: 'userkind',
                    width: 120
                }, {
                    title: '做题数',
                    key: 'post_number',
                    width: 90
                }, {
                    title: '通过数',
                    key: 'pass_number',
                    width: 90
                }, {
                    title: 'AC率',
                    key: 'ac_green',
                    width: 70,
                    render: (h, params) => {
                        return h('div', parseInt(params.row.ac_green * 100) + "%")
                    }
                }, {
                    title: '操作',
                    key: 'action',
                    width: 150,
                    align: 'center',
                    render: (h, params) => {
                        return h('div', [
                            h('Button', {
                                props: {
                                    type: 'primary',
                                    size: 'small'
                                },
                                style: {
                                    marginRight: '5px'
                                },
                                on: {
                                    click: () => {
                                        this.show(params.row.schoolid)
                                    }
                                }
                            }, '查看'),
                            h('Button', {
                                props: {
                                    type: 'error',
                                    size: 'small'
                                },
                                on: {
                                    click: () => {
                                        this.remove(params.index)
                                    }
                                }
                            }, '删除')
                        ]);
                    }
                }
                ],
                data6: [{
                    number: 1,
                    name: '用户1',
                    studentid: 123456789001,
                    clases: '普通用户',
                    qn: 400,
                    an: 200,
                    ac: '50%'
                }],
                cityList: [
                    {
                        value: '2018',
                        label: '18级学生'
                    },
                    {
                        value: '2017',
                        label: '17级学生'
                    },
                    {
                        value: '2016',
                        label: '16级学生'
                    },
                    {
                        value: '2015',
                        label: '15级学生'
                    },
                    {
                        value: 'other',
                        label: '其他用户'
                    }
                ],
                grade: ' ',
                search_name: '',
                search_id: '',
                pageData: [],
                pageSize: 10,
                pageNum: 1,
                total: 0,
                loading: true,
                allData:[],
            }
        },
        methods: {
            handlePage(value) {
                let _start = (value - 1) * this.pageSize;
                let _end = value * this.pageSize;
                this.data6 = this.allData.slice(_start, _end);
                this.pageNum = value;
            },
            getQMessages(data) {
                this.allData=data;
                this.total = data.length;
                this.pagedata = data;
                let dataCount = this.pagedata.length;
                if (dataCount < this.pageSize) {
                    this.data6 = this.pagedata;
                } else {
                    this.data6 = this.pagedata.slice(0, this.pageSize);
                }
            },
            search() {
                let _this = this;
                let Param = new URLSearchParams();
                Param.append("grade", this.grade);
                Param.append("name", this.search_name);
                Param.append("schoolid", this.search_id);
                this.ajax.post(_this.postIp + "/search", Param).then(function (msg) {
                    if (msg.data.message === '成功') {
                        _this.getQMessages(msg.data.data);
                    } else {
                        _this.$Message.warning("未找到该学生");
                    }
                });
            },
            callback() {

            },
            show(index) {
                this.$router.push({
                    name: 'member_info',
                    params: {schoolID: index},
                })
            },
            searchByGrade(index) {
                let _this = this;
                let allData;
                let Param = new URLSearchParams();
                Param.append("grade", index);
                this.ajax.post(_this.postIp + "/get_all_student_information", Param).then(function (msg) {
                    allData = msg.data.data;

                    _this.getQMessages(allData);
                });

            }
        }

    }
</script>
